<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <title>会议预约详情</title>
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="css/form.css" />
    <link rel="stylesheet" type="text/css" href="css/comm.css" />
    <link rel="stylesheet" type="text/css" href="css/meetcomm.css" />
    <link rel="stylesheet" type="text/css" href="../script/vant/index.css" />
    <style>
        .new-aui-tag {
            border: solid 0.5px #0079fe;
            color: #0079fe;
            background-color: #fff;
            padding: 5px 10px;
            border-radius: 4px;
        }

        .table-list div {
            border: solid 0.5px #ddd;
            border-top: 0;
            border-right: 0;
            padding-top: 5px;
            padding-bottom: 5px;
        }

        .table-header {
            border-top: solid 0.5px #ddd;
            background-color: #eee;
            color: #999;
        }

        .border-rightline {
            border-right: solid 0.5px #ddd;
        }
    </style>
</head>

<body>
    <div id="app" class="uni-top uni-bottom80" v-cloak>
        <div class="uni-bottom50 aui-margin-t-15">
            <div class="uni-panel-hs border-r mbpb">
                <div class="public-title border-bottomLine pd82">
                    <label class="uni-textTitle uni-childTitle">会议信息</label>
                </div>
                <div class="uni-list">
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">会议室名称</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{RoomName}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">申请人</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{form.CreateUserName}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">申请电话</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{form.Phone}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">申请时间</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{form.CreateTime}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">所属部门</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{form.CreateUserDepartment?form.CreateUserDepartment:'--'}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">预约时段</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{form.ReservationDate}} {{form.ReservationStartTime}}至{{form.ReservationEndTime}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">会议时长</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{form.ReservationDuration?form.ReservationDuration:'--'}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">参会人员</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{form.PeopleNumber?form.PeopleNumber:'0'}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">会议主题</div>
                        <div class="text right-view" style="padding:6px 0px">
                            {{form.MeetingTitle?form.MeetingTitle:'--'}}
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">会议描述</div>
                        <div class="text right-view" style="padding:6px 0px"></div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        {{form.Description?form.Description:'--'}}
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        <div class="text left-view uni-leftText bfbfbf">备注信息</div>
                        <div class="text right-view" style="padding:6px 0px">
                        </div>
                    </div>
                    <div class="uni-flex uni-row view-margin uni-text-color-grey">
                        {{form.Mark?form.Mark:'--'}}
                    </div>
                </div>
            </div>

            <!--会议服务-->
            <div class="uni-panel-hs border-r mbpb">
                <div class="public-title border-bottomLine pd82">
                    <label class="uni-textTitle uni-childTitle">会议服务</label>
                </div>
                <div class="aui-margin-t-10 view-margin" style="text-align:center;">
                    <van-row class="table-list table-header border-rightline">
                        <van-col span="8">服务名称</van-col>
                        <van-col span="8">单价/单位</van-col>
                        <van-col span="8">已选数量</van-col>
                    </van-row>
                    <van-row v-for="(item,index) in ServiceList" :key="index" class="table-list border-rightline" style="display: flex;">
                        <van-col span="8">{{item.ServicesName}}</van-col>
                        <van-col span="8">{{item.UnitPrice?item.UnitPrice.toFixed(2):0.00}}/{{item.Unit}}</van-col>
                        <van-col span="8">{{item.Number}}</van-col>
                    </van-row>
                </div>
                <div class="view-margin aui-margin-t-10" style="text-align: right;">
                    合计金额：<label class="text-red">¥{{TotalPrice}}</label>
                </div>
            </div>

            <!--临时物品-->
            <div class="uni-panel-hs border-r mbpb">
                <div class="public-title border-bottomLine pd82">
                    <label class="uni-textTitle uni-childTitle">临时物品</label>
                </div>
                <div class="aui-margin-t-10 view-margin">
                    <label class="aui-label new-aui-tag aui-margin-r-10 aui-margin-b-10"
                        v-for="item in ItemList">{{item.Name}}</label>
                </div>
            </div>
        </div>

        <div v-if="form.Status==1" v-on:click="doMeetEnd()" class="aui_bottom" style="position:fixed;">
            <div class="aui_bottombtn">结束会议</div>
        </div>
        <div v-if="form.Status==0" v-on:click="doMeetCancel()" class="aui_bottom" style="position:fixed;">
            <div class="aui_bottombtn">取消预约</div>
        </div>
    </div>
</body>
<script type="text/javascript " src="../script/api.js"></script>
<script type="text/javascript " src="../script/vue.js"></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript" src="../script/aui-dialog.js"></script>
<script type="text/javascript" src="../script/aui-tab.js"></script>
<script type="text/javascript" src="../script/aui-popup.js"></script>
<script type="text/javascript " src="../script/vant/vue.js"></script>
<script type="text/javascript " src="../script/vant/vant.js"></script>
<script type="text/javascript " src="../script/moment/moment.js"></script>
<script type="text/javascript " src="js/visitormeetdetail.js"></script>

</html>